fix(MenuButton): 14063 Allow to pass popover classname as a prop. Fix passing className prop to MenuList, MenuPopover, DropdownPopover #100
Conversation
WalkthroughThe changes involve modifications to several components within the UI kit, primarily focusing on how class names are constructed and passed to components. The Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant DropdownPopover
participant MenuList
participant MenuPopover
participant Popover
User->>DropdownPopover: Interacts with dropdown
DropdownPopover->>MenuList: Renders menu list
MenuList->>MenuPopover: Passes custom classes
MenuPopover->>Popover: Renders popover with styles
Popover->>User: Displays popover
Poem
Recent review detailsConfiguration used: CodeRabbit UI Files selected for processing (1)
Additional comments not posted (4)
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
|
♻️ PR Preview 2008af1 has been successfully destroyed since this PR has been closed.
🤖 By surge-preview |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
Review details
Configuration used: CodeRabbit UI
Review profile: ASSERTIVE
Files selected for processing (4)
- packages/ui-kit/src/Dropdown/components/DropdownPopover/index.tsx (1 hunks)
- packages/ui-kit/src/MenuButton/components/MenuList/index.tsx (1 hunks)
- packages/ui-kit/src/MenuButton/components/MenuPopover/index.tsx (1 hunks)
- packages/ui-kit/src/Popover/index.tsx (1 hunks)
Additional comments not posted (5)
packages/ui-kit/src/MenuButton/components/MenuList/index.tsx (2)
20-26: LGTM!The changes to the
MenuListcomponent are approved:
- The destructuring of the
classNameandclassesproperties aligns with the updatedMenuListPropsinterface.- The construction of the
dynamicClassesvariable using thecnfunction is a common and correct pattern for conditionally applying classes in React components.
29-29: LGTM!The change to pass the
classes?.popovervalue as theclassNameprop to theMenuPopovercomponent is approved. This allows for custom styling of the popover through theclassesprop of theMenuListcomponent, enhancing flexibility.packages/ui-kit/src/MenuButton/components/MenuPopover/index.tsx (1)
24-30: LGTM!The changes to the
dynamicClassesvariable construction improve code readability by expanding the object passed tocninto a more explicit block format. This change does not alter the functionality of theMenuPopovercomponent and may facilitate easier future modifications or additions to the class names being applied.The changes are consistent with the AI-generated summary.
packages/ui-kit/src/Dropdown/components/DropdownPopover/index.tsx (1)
87-87: LGTM!The changes to the
cnfunction call enhance the flexibility of class name composition and potentially improve readability and maintainability without altering the overall functionality of theDropdownPopovercomponent.packages/ui-kit/src/Popover/index.tsx (1)
48-53: LGTM!The changes to the
dynamicClassesvariable declaration improve code readability by clearly delineating the object being passed to thecnfunction. The logical functionality remains unaffected.
albaranau
deleted the
14063-menu-dropdown-allow-to-pass-popover-classname
branch
We need to pass z-index to MenuPopover, otherwise it gets hidden by panels beneath it. This PR adds
classesprop to MenuList, which allows passingpopoverclassname.It also fixes passing className prop to MenuList, MenuPopover, DropdownPopover (it was not working correctly)
Summary by CodeRabbit
New Features
MenuListcomponent with the addition of aclassesproperty, allowing users to define specific styles for theMenuPopover.Bug Fixes
DropdownPopover,MenuPopover, andPopoverImplcomponents without altering their functionality.